$(function () {
  let form = layui.form;
  let layer = layui.layer;

  // 初始化富文本编辑器
  initEditor();

  // 文章标签下拉部分渲染
  initCate();
  // 定义加载文章分类的方法
  function initCate() {
    axios({
      method: 'get',
      url: 'http://124.223.14.236:8060/home/index/index',
    }).then(function (res) {
      // console.log(res);
      if (res.status !== 200) {
        return layer.msg('初始化文章分类失败！');
      }
      let catename_html = res.data.data.allCate.map(item => {
        return `
        <option id="fenlei" value="${item.id}">${item.catename}</option>
      `;
      });
      $('#article_category').append('<option value="">请选择分类</option>');
      $('#article_category').append(catename_html.join(''));
      // 一定要记得调用 form.render() 方法
      // form.render();
    });
  }

  // 文章分类部分改变事件
  let fenlei_id;
  $('#article_category').on('change', function () {
    fenlei_id = $(this).val();
    localStorage.setItem('fenlei_id', 'fenlei_id');
  });

  // 文章标签部分渲染
  initTag();
  function initTag() {
    axios({
      method: 'get',
      url: 'http://124.223.14.236:8060/home/index/index',
    }).then(function (res) {
      // console.log(res);
      if (res.status !== 200) {
        return layer.msg('初始化文章标签失败！');
      }
      let tagname_html = res.data.data.allTag.map(item => {
        return `
        <label>
          <input type="checkbox" / value="${item.id}">
              ${item.tagname}
        </label>
      `;
      });
      $('#tagName').append(tagname_html.join(''));
    });
  }

  // 为上传图片的按钮，绑定点击事件处理函数
  $('.btn-sm').on('click', function () {
    $('#coverFile').click();
  });

  // // 监听 coverFile 的 change 事件，获取用户选择的文件列表
  // $('#coverFile').on('change', function (e) {
  //   // 获取到文件的列表数组
  //   let files = e.target.files;
  //   // 判断用户是否选择了文件
  //   if (files.length === 0) {
  //     return;
  //   }
  //   let fileObj = $('#coverFile')[0];
  //   let img = document.getElementById('picture'); //获得用户上传的图片节点
  //   let reader = new FileReader();
  //   // 转换成功后的操作，img.src即为转换后的DataURL
  //   reader.onload = function (e) {
  //     if (reader.readyState === 2) {
  //       //加载完毕后赋值
  //       img.src = e.target.result;
  //       // console.log(img.src);
  //     }
  //   };
  //   reader.readAsDataURL(fileObj.files[0]);
  //   // $('#form').submit()
  // });
  let img = null;

  // 上传文件请求接口把图片保存到接口里面
  $('body').on('submit', '#form', e => {
    e.preventDefault();
    let fd = new FormData($('#form')[0]);
    $.ajax({
      url: 'http://124.223.14.236:8060/home/common/upload?type=images',
      method: 'post',
      data: fd,
      headers: {
        token: localStorage.getItem('token'),
      },
      contentType: false,
      processData: false,
      success: function (res) {
        img = res.data.savePath;
        console.log(res);
        $('#picture').prop('src', 'http://124.223.14.236:8060/' + img);
        localStorage.setItem('img', "'http://124.223.14.236:8060/' + img");
      },
    });
  });

  // 为存为草稿按钮，绑定点击事件处理函数
  $('.btn-primary').on('click', function () {
    axios({
      method: 'post',
      url: 'http://124.223.14.236:8060/home/user/addArticle',
      headers: {
        token: localStorage.getItem('token'),
      },
      data: {
        title: $('#title').val(),
        author: 'string',
        cateid: 0,
        tags: fenlei_id,
        pic: img,
        content: 'string',
        status: 1,
      },
    }).then(function (res) {
      console.log(res);
      if (res.data.errno !== 0) {
        return layer.msg('发布文章失败！');
      }
      layer.msg('发布文章成功！');
      location.href = './user-list.html';
      window.myArticle();
    });
  });

  // 为发布文章按钮，绑定点击事件处理函数
  $('.btn-ok').on('click', function () {
    if ($('#title').val().trim().length <= 0 || $('#article_category').val().trim().length <= 0) {
      return layer.msg('未输入必选项');
    }
    axios({
      method: 'post',
      url: 'http://124.223.14.236:8060/home/user/addArticle',
      headers: {
        token: localStorage.getItem('token'),
      },
      data: {
        title: $('#title').val(),
        author: 'string',
        cateid: 0,
        tags: fenlei_id,
        pic: img,
        content: 'string',
        status: 2,
      },
    }).then(function (res) {
      console.log(res);
      if (res.data.errno !== 0) {
        return layer.msg('发布文章失败！');
      }
      layer.msg('发布文章成功！');
      location.href = './user-list.html';
      // window.myArticle();
    });
  });

  // 为取消按钮绑定点击事件
  $('.btn-warning').on('click', function () {
    location.href = './user.html';
  });
});
homePage();
// 首页和全局数据
function homePage() {
  axios({
    method: 'GET',
    url: 'http://124.223.14.236:8060/home/index/index',
  }).then(function (res) {
    // console.log(res);
    // 导航栏
    let strNav = res.data.data.allCate
      .map(item => {
        return `
          <li class="menu-item menu-item-type-taxonomy menu-item-object-category">
              <a href="list.html" id=${item.id}><span class="fa fa-bullhorn iconfont ${item.icon}"></span>${item.catename}</a>
          </li>
          `;
      })
      .join('');
    $('#nav').append(strNav);
  });
}
userCenter();
// 用户中心和退出
function userCenter() {
  // 没有token的时候隐藏用户中心和退出
  if (localStorage.getItem('token')) {
    let str = `
         <a href="user.html" id="user"><i class="fa fa-user"></i>&nbsp;用户中心</a>
         <a href="javascript:;" class="quit"><i></i>&nbsp;退出</a>`;
    $('.slinks').html(str);
  } else {
    let str = `
          <a href="login.html"><i class="fa fa-hand-o-right"></i>&nbsp;登录</a> |
          <a href="reg.html"><i class="fa fa-registered"></i>&nbsp;注册</a>`;
    $('.slinks').html(str);
  }
  $('#user').on('click', function (e) {
    e.preventDefault();
    if (localStorage.getItem('token')) {
      location.href = 'user.html';
    } else {
      location.href = 'login.html';
    }
  });
  $('.quit').on('click', function (e) {
    layer.confirm('你确定要退出吗?', { icon: 3, title: '退出提示' }, function (index) {
      localStorage.removeItem('token');
      location.reload();

      layer.close(index);
    });
  });
}
// 导航栏跳转
function getNavSkip() {
  $('#nav').on('click', 'a', function (e) {
    e.preventDefault();
    window.open('../list.html?id=' + $(this).attr('id'));
  });
}
getNavSkip();
